<!--  -->
<template>
    <div class="">
        <Transition :name="name">
            <slot></slot>
        </Transition>
    </div>
</template>

<script lang="ts" setup>
import { ref, reactive, onBeforeMount, onMounted, computed } from 'vue';
const props = defineProps({
    // 动画类型名称: 淡入淡出 fade |
    name: {
        type: String,
        default: 'fade'
    }
});

const install = (app: any) => {
    app.component('LiTransitio', this);
};
</script>

<style lang="less" scoped>
// 淡入淡出
.fade-enter-active,
.fade-leave-active {
    transition: opacity 0.5s ease;
}

.fade-enter-from,
.fade-leave-to {
    opacity: 0;
}
</style>
